<template>
  <view class="content">
    <view class="box" @click="onClick"></view>

    <image class="logo" src="/static/logo.png" />
    <!-- #ifdef H5 -->
    <view>H5</view>
    <!-- #endif -->

    <!-- #ifndef H5 -->
    <view>除了H5之外其它平台</view>
    <!-- #endif -->

    <button @click="jump">跳转到生命周期页面</button>

    <banner />

    <abcd-hello />

    <uni-calendar />
  </view>
</template>

<script setup lang="ts">
import { ref } from "vue";
import { onLoad } from "@dcloudio/uni-app";
const title = ref("Hello World");

onLoad(() => {
  console.log("环境变量", import.meta.env.VITE_HOME);
});

const jump = () => {
  uni.navigateTo({
    url: "/pages/lifetimes/lifetimes?a=1&b=2",
  });
};

const onClick = () => {
  // #ifdef H5
  alert("H5");
  // #endif

  // #ifdef MP-WEIXIN
  uni.showToast({ title: "小程序" });
  // #endif
};
</script>

<style>
.box {
  width: 400rpx;
  height: 400rpx;
  /* #ifdef MP-WEIXIN */
  background-color: green;
  /* #endif */

  /* #ifdef H5 */
  background-color: red;
  /* #endif */
}

.content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.logo {
  height: 200rpx;
  width: 200rpx;
  margin-top: 200rpx;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 50rpx;
}

.text-area {
  display: flex;
  justify-content: center;
}

.title {
  font-size: 36rpx;
  color: #8f8f94;
}
</style>
